<template>
  <div v-if="error != ''" class="w-75 m-auto mt-4">
    <h3 class="text-danger">{{ error }}</h3>
  </div>
</template>

<script>
import { useFetch } from "@vueuse/core";

export default {
  props: {
    uuid: String,
  },
  data() {
    return {
      error: "",
    };
  },
  mounted() {
    const { isFetching, data, onFetchError, onFetchResponse } = useFetch(
      `${process.env.VUE_APP_BASE_URI}/verification/${this.uuid}`
    ).get();

    onFetchError((error) => {
      this.error = error.message;
    });

    onFetchResponse(() => {
      let d = JSON.parse(data.value);
      // Складываем данные в local Storage
      localStorage.setItem("tokens", JSON.stringify(d.tokens));
      localStorage.setItem("user", JSON.stringify(d.user));
      // Обновляем глобальное состояние данных
      this.$emit("dataUpdate", d);
      // Редирект на главную
      this.$router.push("/");
    });
    return { isFetching };
  },
};
</script>

<style>
</style>